import {
    createApp
} from 'vue'
import axios from 'axios'
import router from './router'
import store from './store'
import { hasPermission } from './utils/permissionDirective';
import {
    Button,
    Dialog,
    Icon,
    Divider,
    Tab,
    Tabs,
    Toast,
    Notify,
    Tabbar,
    TabbarItem,
    Image as VanImage,
    Lazyload,
    Loading,
    NoticeBar,
    Swipe,
    SwipeItem,
    Form,
    Field,
    Cell,
    CellGroup,
    Picker,
    Popup,
    Rate,
    Stepper,
    Empty,
    List,
    Overlay,
    NavBar,
    PullRefresh,
    AddressList,
    AddressEdit,
    Uploader,
    RadioGroup, 
    Radio,
    Collapse, 
    CollapseItem,
    DatetimePicker,
    Pagination
} from 'vant'
import App from './App.vue'

import 'lib-flexible'
import 'vant/lib/index.css'
import './assets/css/style.scss'

import VueLuckyCanvas from '@lucky-canvas/vue'

const app = createApp(App)
app.config.globalProperties.$axios = axios

app.use(VueLuckyCanvas)
app.use(Button).use(Dialog).use(Icon)
    .use(Divider).use(Tab).use(Tabs)
    .use(Toast).use(Notify).use(Tabbar).use(TabbarItem)
    .use(VanImage).use(Lazyload).use(Loading).use(NoticeBar)
    .use(Swipe).use(SwipeItem).use(Form).use(Field).use(Cell)
    .use(CellGroup).use(Picker).use(Popup).use(Rate).use(Stepper)
    .use(Empty).use(List).use(Overlay).use(NavBar).use(PullRefresh)
    .use(AddressList).use(AddressEdit).use(Uploader).use(RadioGroup).use(Radio)
    .use(Collapse).use(CollapseItem)
    .use(DatetimePicker)
    .use(Pagination)
app.use(router).use(store)
app.directive('has-permission', hasPermission);

app.mount('#app')